﻿<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>学历补贴</title>

    <!--使用IE兼容模式渲染-->
    <meta http-equiv="X-UA-Compatible" content="IE=edge,Chrome=1"/>
    <meta name="renderer" content="webkit">

    <link rel="stylesheet" href="http://css.tt.gzedu.com/workeredu_cn/platform_admin/v1.0/style/dist/zui@1.8.1/css/zui.min.css">
    <link rel="stylesheet" href="http://css.tt.gzedu.com/workeredu_cn/platform_admin/v1.0/style/dist/zui@1.8.1/css/zui-theme.css">
    <link rel="stylesheet" href="http://css.tt.gzedu.com/workeredu_cn/platform_admin/v1.0/style/dist/hover.css">

    <link rel="stylesheet" href="http://css.tt.gzedu.com/workeredu_cn/platform_admin/v1.0/style/h-base.css">
    <link rel="stylesheet" href="http://css.tt.gzedu.com/workeredu_cn/platform_admin/v1.0/style/h-index.css">

    <style>
        .btxm_bar_list .bar_item {
            width: 33%;
        }
    </style>
</head>
<body class="childrenBody">
<div class="xmfp_body">
    <a href="javascript:;" class="out_btn">
        <span> < </span> 广州市总工会《2018年学历教育补贴》
    </a>
</div>

<div class="row">

    <div class="col-sm-12 text-center">

        <div style="background-color: #ffffff;padding: 20px 0 50px">
            <div class="btxm_bar_list">
                <a href="javascript:;" class="bar_item state">
                    <i></i>
                    <em></em>
                    <span class="hr-fr"></span>
                    <h4>生成结算单</h4>
                    <p>第一步</p>
                </a>

                <a href="javascript:;" class="bar_item state">
                    <i></i>
                    <em></em>
                    <span class="hr-fl"></span>
                    <span class="hr-fr"></span>
                    <h4>上传回执凭证</h4>
                    <p>第二步</p>
                </a>
                <a href="javascript:;" class="bar_item">
                    <i></i>
                    <em></em>
                    <span class="hr-fl"></span>
                    <h4>查看发放清单</h4>
                    <p>第三步</p>
                </a>

            </div>
            <p>发放完成后，请舞弊上传汇款凭证（扫描或拍照），货款金额必须与发放金额一直，确认发放后操作生效。</p>
        </div>

    </div>

    <div class="col-sm-12">
        <div class="pz_list_success">
            <div class="kc_item">
                <p>上传职工发放名单</p>
                <div class="input_file">
                    <input type="text" class="upload-tip" placeholder="选择文件" disabled>
                    <input type="file" class="upload-input-file">
                </div>
                <a href="javascript:;">案例</a>
                <a href="javascript:;">下载表头</a>
            </div>
            <div class="kc_item">
                <p>上传银行代发款凭证</p>
                <div class="input_file">
                    <input type="text" class="upload-tip" placeholder="选择文件" disabled>
                </div>
            </div>
        </div>
    </div>

    <div class="col-sm-12">
        <div class="text-center" style="margin-top: 20px">
            <button type="button" class="btn btn-danger btn-lg">上传发放凭证</button>
        </div>
    </div>

</div>

<script type="text/javascript" src="http://css.tt.gzedu.com/workeredu_cn/platform_admin/v1.0/js/jquery-2.1.4.min.js"></script>
<script type="text/javascript" src="http://css.tt.gzedu.com/workeredu_cn/platform_admin/v1.0/style/dist/zui@1.8.1/js/zui.min.js"></script>


<script>
    $(function(){
        $('.yhxz_list').on('click','.form_item', function () {
            $(this).addClass('active').siblings().removeClass('active') ;
        })


        $(".upload-input-file").change(function () {
            if ($(this).parent().html().indexOf("class=\"upload-url\"") != -1) {
                var fileUrl = $(this).val();
                $(this).parent().children(".upload-url").val(fileUrl);
            }
            else {
                var fileUrl = $(this).val();
                var urlArr = fileUrl.split("\\");
                var getName = urlArr[urlArr.length - 1];//截取路径并获取文件的名字
                $(this).parent().children(".upload-tip").val(getName);
            }
        });

    });

</script>
</body>
</html>